<template>
    <div class="mini-wrap mg-center" style="margin-top:200px;">
        <el-form :model="loginForm" :rules="rules" ref="ruleForm" label-width="auto" class="margin-top">
            <el-form-item label="" prop="username">
                <el-input v-model="loginForm.username" placeholder="用户名"></el-input>
            </el-form-item>
            <el-form-item label="" prop="password">
                <el-input v-model="loginForm.password" show-password placeholder="密码" maxlength="20"></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="submitForm('ruleForm')" class="block">登录</el-button>
            </el-form-item>
        </el-form>
    </div>
</template>

<script>
export default {
    name: "Login",
    data() {
        return {
            loginForm: {
                username: '',
                password: '',
            },
            //测试数据
            testData:{
                aaa:'',
                bbb:'',
            },
            rules: {
                username: [
                    {required: true, message: '请输入用户名', trigger: 'blur'}
                ],
                password: [
                    {required: true, message: '请输入密码', trigger: 'blur'},
                    {min: 1, max: 20, message: '请输入1-20位密码', trigger: 'blur'}
                ]
            }
        };
    },
    methods: {
        postTest(){
            let _this = this;
            this.$http.httpPost({
                url:'/api/auth/login',
                datas:this.loginForm,
                success(res){
                    //成功回调
                    //res 为data字段数据
                    _this.testData.aaa = res.aaa;
                    _this.testData.bbb = res.bbb;
                }
            })
        },
        submitForm(formName) {
            let _this = this;
            this.$refs[formName].validate((valid) => {
                if (valid) {

                    this.$http.httpPost({
                        url:'/api/auth/login',
                        datas:this.loginForm,
                        success(res){
                            if (res.type != 'admin') {
                                _this.$utils.warning('权限验证失败！');
                                return false;
                            }
                            _this.$user.setToken(res.token);
                            _this.$user.setUid(res.id);
                            _this.$user.setUserName(res.username);
                            _this.$router.replace({path:'/'});
                        }
                    })
                    // _this.$user.setToken('222');
                    // _this.$user.setUid('222');
                    // _this.$user.setUserName('admin');

                } else {
                    console.log('error submit!!');
                    return false;
                }
            });
        },
    }
}
</script>
